<script src="<?php echo base_url();?>resources/global/scripts/datatable.js" type="text/javascript"></script>

<div class="page-content-wrapper">
		<div class="page-content">
			<div class="row">
				<div class="col-md-12">
					<!-- BEGIN PAGE TITLE & BREADCRUMB-->
					<h3 class="page-title">
					Slider Management
					</h3>
					<ul class="page-breadcrumb breadcrumb">
						<li>
							<i class="fa fa-home"></i>
							<a href="<?php echo base_url();?>admin/dashboard">Dashboard</a>
							<i class="fa fa-angle-right"></i>
						</li>
						<li>
							<a href="javascript:void(0);">Slider Management</a>
						</li>
					</ul>
				</div>
			</div>

			<!-- Modal to add new images starts -->

				<div class="modal fade" id='myModal'>
				  <div class="modal-dialog">
				    <div class="modal-content">
				    <form action="<?php echo base_url();?>admin/add_slider_images" method="POST" enctype="multipart/form-data">
				      <div class="modal-header">
				        <h4 class="modal-title">Add New Slider Images</h4>
				      </div>
				      <div class="modal-body">
				        <div class='row'>
				        	<div class='col-md-1'>
				        	&nbsp;
				        </div>
				        <div class='col-md-4'>
				        	<label>Select Image</label>
				        </div>
				        	<div class="fileinput fileinput-new" data-provides="fileinput">
							  <div class="fileinput-preview thumbnail" data-trigger="fileinput" style="width: 200px; height: 150px;"></div>
							  <div>
							    <span class="btn btn-default btn-file"><span class="fileinput-new">Select image</span><span class="fileinput-exists">Change</span><input type="file" name="files"></span>
							    <a href="#" class="btn btn-default fileinput-exists" data-dismiss="fileinput">Remove</a>
							  </div>
							</div>
				        </div>

				        <br style='clear:both;'>

				        <div class='row'>
				        	<div class='col-md-1'>
				        		&nbsp;
				        	</div>
				        	<div class='col-md-2'>
				        		<label>Is active</label>
				        	</div>
				        	<div class='col-md-2'>
				        		<input type="checkbox" name='is_active' value='1'>
				        	</div>
				        </div>
				        <br style='clear:both;'>

				        <div class='row'>
				        	<div class='col-md-1'>
				        		&nbsp;
				        	</div>
				        	<div class='col-md-2'>
				        		<label>Content</label>
				        	</div>
				        	<div class='col-md-8'>
				        		<textarea class='form-control' rows='2' maxlength='90' name='slider_content'></textarea>
				        	</div>
				        </div>
				        <br style='clear:both;'>

				      </div>
				      <div class="modal-footer">
				        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
				        <button type="submit" class="btn btn-primary">Save changes</button>
				      </div>
				      </form>
				    </div>
				  </div>
				</div>

			<!-- Modal to add new images ends -->

	<div class="row">
		<div class="col-md-12">
			<div class="tabbable tabbable-custom boxless tabbable-reversed">						
				<div class="tab-content">
					<div class="tab-pane active" id="tab_0">
						<div class="portlet box green">
							<div class="portlet-title">
								<div class="caption">
									<i class="fa fa-gift"></i>Manage Slider Images	
								</div>
								<a class='btn btn-primary pull-right' style='margin-bottom:4px;' data-toggle='modal' data-target='#myModal'><i class="fa fa-plus"></i>&nbsp;Add New Images</a>
							</div>
						</div>

					<table class="table table-hover table-bordered" id="data">
						<thead>
				            <tr>
				                <th>id</th>
				                <th>Image Name</th>
				                <th>is_active</th>
				                <th>Actions</th>
				            </tr>
				        </thead>
				        <tbody>
			        	<?php foreach ($slider_data as $value) { ?>
			        		<tr>
			        			<td><?php echo $value['id']; ?></td>
			        			<td><?php echo $value['image_name']; ?></td>
			        			<td><?php echo $value['is_active']; ?></td>
			        			<td><a class="btn btn-primary edit" href="<?php echo base_url();?>admin/edit_slider/<?php echo $value['id']; ?>">Edit</a>
			  					<a class="btn btn-danger del" id="del" href="<?php echo base_url();?>admin/del_slider/<?php echo $value['id']; ?>">Delete</a></td>
			        		</tr>
			        	<?php } ?>   
			        	</tbody>
					
					</table>


<script>
$(document).ready(function(){
	/*initTable();*/


	$('.del').on('click',function(){
		return confirm("Are You Sure??");
	})
})
	/*function initTable()
	{*/
 		/*var table = $('#data').val();		
        table.dataTable({
         "bFilter": false,
            "lengthMenu": [
                [10, 25, 50, -1],
                [10, 25, 50, "All"] // change per page values here
            ],
            "columnDefs": [{  // set default column settings
                'orderable': false,
                'targets': [0]
            }, {
                "searchable": false,
                "targets": [0]
            }],
            "order": [
                [1, "asc"]
            ] // set first column as a default sort by asc
        });*/

        /*var tableWrapper = jQuery('#data');

        table.find('.group-checkable').change(function () {
            var set = jQuery(this).attr("data-set");
            var checked = jQuery(this).is(":checked");
            jQuery(set).each(function () {
                if (checked) {
                    $(this).attr("checked", true);
                } else {
                    $(this).attr("checked", false);
                }
            });
            jQuery.uniform.update(set);
        });*/
   /* }
*/
</script>